<template>
  <h3 style="margin-bottom: 20px">订单编辑</h3>
  <el-form
      ref="ruleFormRef"
      :model="order"
      label-width="120px"
      style="width: 600px;"
  >
    <el-form-item label="会员">
      <el-select v-model="order.memberId">
        <el-option v-for="vip in vipsRef"
                   :label="vip.name" :value="vip.id" :key="vip.id"/>
      </el-select>
    </el-form-item>
    <el-form-item label="菜品选择">
      <el-select
          v-model="cuisineSelected"
          multiple
          placeholder="Select"
          style="width: 240px"
      >
        <el-option
            v-for="item in cuisinesRef"
            :key="item.id"
            :label="item.name"
            :value="item.id"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="评分">
      <el-rate v-model="rateRef" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitForm(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
</template>

<script setup>
import {onMounted, ref} from "vue";
import say from "../../util/say";
import {Fetch} from "../../api/request";
import {listCuisinesProApi, listMarketingApi, listVIPApi} from "../../api";

let ruleFormRef = ref(null);
let vipsRef = ref([])
let cuisinesRef = ref([])
let marketingRef = ref([])
let rateRef = ref(0)
onMounted(async () => {
  let vips = await ((await listVIPApi())).json()
  for (let v of vips.data) {
    let id = v.id
    let name = v.name
    let sex = v.sex
    let phone = v.phone
    let grade = v.grade
    let integration = v.integration
    vipsRef.value.push({id, name, sex, phone, grade, integration})
  }
  let cuisines = await (await listCuisinesProApi()).json()
  for (let v of cuisines.data) {
    let id = v.id
    let name = v.name
    let price = v.price
    let description = v.description
    cuisinesRef.value.push({id, name,price,description})
  }
  let marketing = await (await listMarketingApi()).json()
  for (let v of marketing.data) {
    let id = v.id
    let cuisineId = v.cuisineId
    let requireGrade = v.requireGrade
    let depleteIntegration = v.depleteIntegration
    let discount = v.discount
    marketingRef.value.push({id, cuisineId, requireGrade, depleteIntegration, discount})
  }
})
let cuisineSelected = ref(null)
let order = ref({
  memberId: null,
  purchaseItems: null,
  totalPrice: 0,
  score: 0
});

const submitForm = async (formElement) => {
  if (!formElement) return
  await formElement.validate(async (valid) => {
    if (valid) {
      let ord = {}
      ord.memberId = order.value.memberId
      ord.purchaseItems = []
      ord.totalPrice = 0
      let cuisineSelectedTruth = []
      for(let item of cuisineSelected.value) {
        for(let item2 of cuisinesRef.value) {
          if (item2.id === item) {
            cuisineSelectedTruth.push(item2)
            break
          }
        }
      }
      for(let item of cuisineSelectedTruth) {
        let cuisineId = item.id
        let cuisineName = item.name
        let number = 1
        let discount = 1
        let price = item.price
        for(let k of marketingRef.value) {
          if (k.cuisineId === cuisineId) {
            discount = k.discount
            break
          }
        }
        ord.purchaseItems.push({cuisineId,cuisineName,number,discount})
        ord.totalPrice += (price*number*discount)
      }
      ord.score = rateRef.value
      ord.time = new Date().getTime()
      ord.totalPrice = Number(ord.totalPrice.toFixed(1))
      order.value = ord

      Fetch.post('/purchase/save', order.value).then(response => {
        if (response.ok) {
          say.saySuccess(`保存成功,订单总价为 ${ord.totalPrice}`)
        } else {
          say.sayError('保存失败')
        }
      }).catch(_ => {
        say.sayError('保存失败')
      });
    } else {
      say.sayError('保存失败')
    }
  })
}
</script>

<style scoped>

</style>